<template>
    <div class="edu-container">
        <span @click="goSub('/sub-vue')">子应用</span>

        <!-- 旧版首页主体内容隐藏 -->
        <!-- <div class="root-box" ref="rootBox">
            <el-row :gutter="0">
                <el-col style="margin-top: 12px;">
                    <div v-if="noticMsgList.length" class="edu-notice">
                        <div class="icon-wrapper">
                            <img src="/static/images/icon/icon_notic.png">
                        </div>
                        <div class="marquee_box" @mouseover="over" @mouseout="out">
                            <ul class="marquee_list" :class="{marquee_top:animate}">
                                <li
                                    v-for="(msg, index) in noticMsgList"
                                    :key="index"
                                    @click="handleMsgDetails(msg.id)"
                                >{{msg.title}}</li>
                            </ul>
                        </div>
                    </div>
                </el-col>
            </el-row>
            <el-row :gutter="16" :style="`height: ${rowHeight};`">
                <el-col :span="6" class="p-b16px" :class="{'edu-height50': isAdaptive}">
                    <div class="edu-model" :class="{'edu-height100': isAdaptive}">
                        <PersonalInfoCard :isAdaptive="isAdaptive"/>
                    </div>
                </el-col>
                <el-col
                    class="p-b16px"
                    :class="{'edu-height50': isAdaptive}"
                    :span="spanStyle.systemNotification"
                >
                    <div class="edu-model" :class="{'edu-height100': isAdaptive}">
                        <SystemNotice
                            ref="SystemNotice"
                            :isAdaptive="isAdaptive"
                            :popMessageList="popMessageList"
                            :systemNoticeList="systemNoticeList"
                        />
                    </div>
                </el-col>
                <el-col class="p-b16px" :class="{'edu-height50': isAdaptive}" :span="6">
                    <div class="edu-model" :class="{'edu-height100': isAdaptive}">
                        <Calendar
                            v-if="calendarInfo"
                            :calendarInfoObj="calendarInfo"
                            :isAdaptive="isAdaptive"
                        />
                    </div>
                </el-col>
                <el-col
                    class="p-b16px"
                    :class="{'edu-height50': isAdaptive}"
                    :span="spanStyle.shortcutMenuCard"
                    v-if="loginUserType !== '2'"
                >
                    <div class="edu-model" :class="{'edu-height100': isAdaptive}">
                        <ShortcutMenuCard :loginUserType="loginUserType"/>
                    </div>
                </el-col>
                <el-col
                    class="p-b16px"
                    :class="{'edu-height50': isAdaptive}"
                    :span="spanStyle.myClassSchedule"
                    v-if="loginUserType !== '1'"
                >
                    <div class="edu-model" :class="{'edu-height100': isAdaptive}">
                        <MyClassSchedule
                            v-if="calendarInfo"
                            :loginUserType="loginUserType"
                            :schoolCalendarObj="calendarInfo"
                        />
                    </div>
                </el-col>
                <el-col
                    class="p-b16px"
                    :class="{'edu-height50': isAdaptive}"
                    :span="spanStyle.shortcutMenuCard"
                    v-if="loginUserType === '2'"
                >
                    <div class="edu-model" :class="{'edu-height100': isAdaptive}">
                        <ShortcutMenuCard :loginUserType="loginUserType"/>
                    </div>
                </el-col>
                <el-col
                    class="p-b16px"
                    :class="{'edu-height50': isAdaptive}"
                    :span="12"
                    v-if="!loginUserType"
                >
                    <div class="edu-model" :class="{'edu-height100': isAdaptive}">
                        <PersonCulturePlan :mockUser="mockUser" :currentUser="currentUser"/>
                    </div>
                </el-col>
                /首页待办事项隐藏
                 <el-col class="p-b16px" :class="{'edu-height50': isAdaptive}" :span="12">
                    <div class="edu-model" :class="{'edu-height100': isAdaptive}">
                        <ToDoList :loginUserType="loginUserType" :isAdaptive="isAdaptive"/>
                    </div>
                </el-col> 
            </el-row>
        </div> -->
        <!-- 新版本首页 -->
        <div v-if="global.isUndergraduate" role="本科首页">
            <div class="container-header">
                <PersonalInfoCard
                    :dept="global.projectId"
                    :calendarInfoObj="calendarInfo"
                ></PersonalInfoCard>
                <ShortcutMenuCard></ShortcutMenuCard>
            </div>
            <div class="container-content">
                <template role="公告">
                    <div class="flex-between" style="margin-bottom: 8px">
                        <div class="label">公告信息</div>
                        <el-button type="text" class="btn" @click="$router.push('/myAnnouncement')">
                            查看更多
                            <i class="el-icon-arrow-right"></i>
                        </el-button>
                    </div>
                    <el-card>
                         
                        <el-tabs
                            v-model="announcementInfo.activedDepartment"
                        >
                            <template v-for="item in announcementInfo.noTabList">
                                <el-tab-pane :label="item.label" :name="item.name" :key="item.name">
                                    <ul
                                        v-if="
                                            announcementInfo.noticMap.noticTopList &&
                                            announcementInfo.noticMap.noticTopList.length > 0
                                        "
                                    >
                                        <li
                                            class="announcement-info"
                                            :class="{ 'li-announcement-info': isAdaptive }"
                                            v-for="(info, index) in announcementInfo.noticMap
                                                .noticTopList"
                                            :key="index"
                                            @click="noticeDetails(info.id)"
                                        >
                                            <div class="info-content">
                                                <img
                                                    class="topping"
                                                    v-if="info.topStatus === '1'"
                                                    src="/static/images/icon/icon_topping.png"
                                                />
                                                <span>{{ info.title }}</span>
                                            </div>
                                            <div class="date">{{ info.publishTime }}</div>
                                        </li>
                                    </ul>
                                    <div
                                        class="spacer"
                                        v-if="
                                            announcementInfo.noticMap.noticTopList &&
                                            announcementInfo.noticMap.noticTopList.length > 0
                                        "
                                    ></div>
                                    <collapse-down>
                                        <ul
                                            v-if="
                                                announcementInfo.noticMap.noticList &&
                                                announcementInfo.noticMap.noticList.length > 0
                                            "
                                        >
                                            <li
                                                class="announcement-info"
                                                :class="{ 'li-announcement-info': isAdaptive }"
                                                v-for="(info, index) in announcementInfo.noticMap
                                                    .noticList"
                                                :key="index"
                                                @click="noticeDetails(info.id)"
                                            >
                                                <div class="info-content">
                                                    {{ info.title }}
                                                </div>
                                                <div class="date">{{ info.publishTime }}</div>
                                            </li>
                                        </ul>
                                    </collapse-down>
                                </el-tab-pane>
                            </template>
                        </el-tabs>
                    </el-card>
                </template>
                <!-- <template role="申请" v-if="!global.isAdmin">
                <div class="flex-between" style="margin: 8px 0">
                    <div class="label">我的申请</div>
                    <el-button type="text" class="btn" @click="$router.push('/StudentRollCheck')">
                        查看更多
                        <i class="el-icon-arrow-right"></i>
                    </el-button>
                </div>
                <el-card class="sub_content">
                    <el-tabs v-model="applicationInfo.activedTab" @tab-click="handleClick">
                        <el-tab-pane label="申请信息" name="1">
                            <el-table :data="applicationInfo.appList" v-if="applicationInfo.appList && applicationInfo.appList.length !==0">
                                <el-table-column label="申请信息">
                                    <template slot-scope="scope">
                                        <a>
                                            {{ scope.row.approvorName }}
                                        </a>
                                        <div
                                            style="
                                                font-size: 12px;
                                                font-weight: normal;
                                                color: #8896a7;
                                            "
                                        >
                                            {{ scope.row.wfTypeName }}
                                        </div>
                                    </template>
                                </el-table-column>
                                <el-table-column label="提交时间" width="200px" align="center">
                                    <template slot-scope="scope">
                                        <div
                                            style="
                                                font-weight: normal;
                                                font-size: 12px;
                                                color: #8896a7;
                                            "
                                        >
                                            {{ scope.row.time | formatDate }}
                                        </div>
                                    </template>
                                </el-table-column>
                                <el-table-column
                                    prop="approvorName"
                                    label="审批人"
                                    align="center"
                                />
                                <el-table-column prop="result" label="审批状态" align="center">
                                    <template slot-scope="scope">
                                        <el-button
                                            v-if="scope.row.result == 'Process'"
                                            type="success"
                                        >
                                            进行中
                                        </el-button>
                                        <el-button v-if="scope.row.result == 'End'" type="info">
                                            已结束
                                        </el-button>
                                        <el-button
                                            v-if="scope.row.result == 'Reject'"
                                            type="warning"
                                        >
                                            已驳回
                                        </el-button>
                                        <el-button
                                            v-if="scope.row.result == 'Recall'"
                                            type="warning"
                                        >
                                            撤回
                                        </el-button>
                                    </template>
                                </el-table-column>
                            </el-table>
                        </el-tab-pane>

                        <el-tab-pane label="历史记录" name="2">
                            <el-table :data="applicationInfo.appHisList" v-if="applicationInfo.appHisList && applicationInfo.appHisList.length !==0">
                                <el-table-column label="申请信息">
                                    <template slot-scope="scope">
                                        <a>
                                            {{ scope.row.approvorName }}
                                        </a>
                                        <div
                                            style="
                                                font-size: 12px;
                                                font-weight: normal;
                                                color: #8896a7;
                                            "
                                        >
                                            {{ scope.row.wfTypeName }}
                                        </div>
                                    </template>
                                </el-table-column>
                                <el-table-column label="提交时间" width="200px" align="center">
                                    <template slot-scope="scope">
                                        <div
                                            style="
                                                font-weight: normal;
                                                font-size: 12px;
                                                color: #8896a7;
                                            "
                                        >
                                            {{ scope.row.time | formatDate }}
                                        </div>
                                    </template>
                                </el-table-column>
                                <el-table-column
                                    prop="approvorName"
                                    label="审批人"
                                    align="center"
                                />

                                <el-table-column prop="result" label="审批状态" align="center">
                                    <template slot-scope="scope">
                                        <el-button
                                            v-if="scope.row.result == 'Process'"
                                            type="success"
                                        >
                                            进行中
                                        </el-button>
                                        <el-button v-if="scope.row.result == 'End'" type="info">
                                            已结束
                                        </el-button>
                                        <el-button
                                            v-if="scope.row.result == 'Reject'"
                                            type="warning"
                                        >
                                            已驳回
                                        </el-button>
                                        <el-button
                                            v-if="scope.row.result == 'Recall'"
                                            type="warning"
                                        >
                                            撤回
                                        </el-button>
                                    </template>
                                </el-table-column>
                            </el-table>
                        </el-tab-pane>
                    </el-tabs>
                </el-card>
            </template> -->
                <!-- <template role="待办" v-if="!global.isStudent">
                <div class="flex-between" style="margin: 8px 0">
                    <div class="label">我的待办</div>
                    <el-button
                        type="text"
                        class="btn"
                        @click="$router.push('/TeacherRollCheckUnapproved')"
                    >
                        查看更多
                        <i class="el-icon-arrow-right"></i>
                    </el-button>
                </div>
                <el-card class="sub_content">
                    <el-tabs v-model="agencyInfo.activedTab" @tab-click="handleClick">
                        <el-tab-pane label="待审批的" name="1">
                            <collapse-down :lineHeight="55" :showNum="5.5">
                                <el-table
                                    :data="agencyInfo.agencyList"
                                    v-if="
                                        agencyInfo.agencyList && agencyInfo.agencyList.length !== 0
                                    "
                                >
                                    <el-table-column label="待办内容" show-overflow-tooltip >
                                        <template slot-scope="scope">
                                            <div
                                                style="
                                                    font-size: 14px;
                                                    font-weight: 600;
                                                    color: #3a7fe8;
                                                "
                                            >
                                                {{ scope.row.approvorName }}
                                            </div>
                                            <div
                                                style="
                                                    font-size: 12px;
                                                    font-weight: normal;
                                                    color: #8896a7;
                                                "
                                            >
                                                {{ scope.row.wfTypeName }}
                                            </div>
                                        </template>
                                    </el-table-column>
                                    <el-table-column label="提交人/时间" width="200px">
                                        <template slot-scope="scope">
                                            <div
                                                style="
                                                    font-weight: 600;
                                                    font-size: 14px;
                                                    color: #4c5c70;
                                                "
                                            >
                                                {{ scope.row.createUser }}
                                            </div>
                                            <div
                                                style="
                                                    font-weight: normal;
                                                    font-size: 12px;
                                                    color: #8896a7;
                                                "
                                            >
                                                {{ scope.row.time | formatDate }}
                                            </div>
                                        </template>
                                    </el-table-column>
                                </el-table>
                            </collapse-down>
                        </el-tab-pane>
                        <el-tab-pane label="历史记录" name="2">
                            <collapse-down :lineHeight="55" :showNum="5.5">
                                <el-table
                                    :data="agencyInfo.agencyHisList"
                                    v-if="
                                        agencyInfo.agencyHisList &&
                                        agencyInfo.agencyHisList.length !== 0
                                    "
                                >
                                    <el-table-column label="待办内容">
                                        <template slot-scope="scope">
                                            <div
                                                style="
                                                    font-size: 14px;
                                                    font-weight: 600;
                                                    color: #3a7fe8;
                                                "
                                            >
                                                {{ scope.row.approvorName }}
                                            </div>
                                            <div
                                                style="
                                                    font-size: 12px;
                                                    font-weight: normal;
                                                    color: #8896a7;
                                                "
                                            >
                                                {{ scope.row.wfTypeName }}
                                            </div>
                                        </template>
                                    </el-table-column>
                                    <el-table-column label="提交人/时间" width="200px">
                                        <template slot-scope="scope">
                                            <div
                                                style="
                                                    font-weight: 600;
                                                    font-size: 14px;
                                                    color: #4c5c70;
                                                "
                                            >
                                                {{ scope.row.createUser }}
                                            </div>
                                            <div
                                                style="
                                                    font-weight: normal;
                                                    font-size: 12px;
                                                    color: #8896a7;
                                                "
                                            >
                                                {{ scope.row.time | formatDate }}
                                            </div>
                                        </template>
                                    </el-table-column>
                                </el-table>
                            </collapse-down>
                        </el-tab-pane>
                    </el-tabs>
                </el-card>
            </template> -->
                <el-backtop target=".edu-container" :bottom="100">
                    <span
                        class="el-icon-top"
                        style="
                             {
                                background-color: #3a7fe8;
                                color: #ffffff;
                            }
                        "
                    ></span>
                </el-backtop>
            </div>
        </div>
        <div v-else role="非本科部门" class="graduate_view">
            <el-row>
                <el-col :span="12">
                    <el-card style="margin-right: 8px" body-style="padding:24px 40px">
                        <PersonalInfoCard
                            :dept="global.projectId"
                            :calendarInfoObj="calendarInfo"
                        ></PersonalInfoCard>
                        <ShortcutMenuCard style="margin-top: 20px"></ShortcutMenuCard>
                    </el-card>
                </el-col>
                <el-col :span="12">
                    <el-card
                        style="margin-left: 8px"
                        body-style="position:relative;padding:58px  8px 16px 24px"
                    >
                        <div role="angle" class="angle">通知公告</div>
                        <div class="scroll_block">
                            <ul
                                v-if="
                                    announcementInfo.noticMap.noticTopList &&
                                    announcementInfo.noticMap.noticTopList.length > 0
                                "
                            >
                                <li
                                    class="announcement-info"
                                    :class="{ 'li-announcement-info': isAdaptive }"
                                    v-for="(info, index) in announcementInfo.noticMap.noticTopList"
                                    :key="index"
                                    @click="noticeDetails(info.id)"
                                >
                                    <div class="info-content">
                                        <img
                                            class="topping"
                                            v-if="info.topStatus === '1'"
                                            src="/static/images/icon/icon_topping.png"
                                        />
                                        <span>{{ info.title }}</span>
                                    </div>
                                    <div class="date">{{ info.publishTime }}</div>
                                </li>
                            </ul>
                            <div
                                class="spacer"
                                v-if="
                                    announcementInfo.noticMap.noticTopList &&
                                    announcementInfo.noticMap.noticTopList.length > 0
                                "
                            ></div>
                            <ul
                                v-if="
                                    announcementInfo.noticMap.noticList &&
                                    announcementInfo.noticMap.noticList.length > 0
                                "
                            >
                                <li
                                    class="announcement-info"
                                    :class="{ 'li-announcement-info': isAdaptive }"
                                    v-for="(info, index) in announcementInfo.noticMap.noticList"
                                    :key="index"
                                    @click="noticeDetails(info.id)"
                                >
                                    <div class="info-content">
                                        {{ info.title }}
                                    </div>
                                    <div class="date">{{ info.publishTime }}</div>
                                </li>
                            </ul>
                        </div>
                    </el-card>
                </el-col>
            </el-row>
            <el-row >
                <el-col :span="12" >
                    <el-card
                        style="margin-top: 0; margin-right: 8px;height:inherit"
                        body-style="position:relative;padding:58px  8px 16px 24px"
                    >
                        <div role="angle" class="angle">同济高等讲堂</div>
                        <el-table
                            :data="higherHallList"
                            class="table"
                            highlight-current-row
                            @current-change="(val) => handleCurrentChange(val, 'H')"
                        >
                            <el-table-column label="讲座名称" show-overflow-tooltip>
                                <template slot-scope="scope">
                                    <a>
                                        {{ scope.row.cathedra }}
                                    </a>
                                </template>
                            </el-table-column>
                            <el-table-column
                                prop="class_level"
                                label="讲座级别"
                                show-overflow-tooltip
                                width="80"
                            >
                                <template slot-scope="scope">
                                    <div v-if="scope.row.class_level == 1">
                                        校级
                                    </div>
                                    <div v-else-if="scope.row.class_level == 2">
                                        院级
                                    </div>
                                    <div v-else>
                                        {{ scope.row.class_level }}
                                    </div>
                                </template>
                            </el-table-column>
                            <el-table-column label="主讲人" width="80" show-overflow-tooltip>
                                <template slot-scope="scope">
                                    <div>
                                        {{ scope.row.name_speaker }}
                                    </div>
                                </template>
                            </el-table-column>
                            <el-table-column
                                label="讲座时间"
                                prop="timeRange"
                                width="180"
                            ></el-table-column>
                        </el-table>
                    </el-card>
                </el-col>
                <el-col :span="12" >
                    <el-card
                        style="margin-top: 0; margin-left: 8px"
                        body-style="position:relative;padding:58px  8px 16px 24px"
                    >
                        <div role="angle" class="angle">论文阶段成果学术报告会</div>
                        <el-table
                            :data="reportList"
                            class="table"
                            highlight-current-row
                            @current-change="(val) => handleCurrentChange(val, 'R')"
                        >
                            <el-table-column label="学生" width="120" show-overflow-tooltip>
                                <template slot-scope="scope">
                                    <div>
                                        {{ scope.row.stuName + '-' + scope.row.stuNo }}
                                    </div>
                                </template>
                            </el-table-column>
                            <el-table-column label="论文题目" show-overflow-tooltip>
                                <template slot-scope="scope">
                                    <a>
                                        {{ scope.row.thesisTitle }}
                                    </a>
                                </template>
                            </el-table-column>
                            <el-table-column
                                prop="symposiumDate"
                                label="会议日期"
                                width="146"
                            ></el-table-column>
                        </el-table>
                    </el-card>
                </el-col>
            </el-row>
        </div>
        <!-- 公告弹框 -->
        <edu-dialog
            width="1000px"
            class="systemDialog"
            @confirm="confirmMsg"
            confirmBtnText="确定"
            :isCustomTitle="true"
            :showCancelBtn="false"
            :autoHeight="false"
            :visible.sync="announcementInfo.visibleDialog"
        >
            <span slot="title">
                <img class="title-img" src="/static/images/icon/icon_title.png" />
                <span class="title-span">
                    {{ announcementInfo.systemNoticeDetails.title }}
                </span>
            </span>
            <div class="info">
                <div class="info-date">
                    {{ $t('workbench.releaseDate')
                    }}{{ announcementInfo.systemNoticeDetails.publishTime }}
                </div>
                <div
                    class="info-content"
                    v-if="announcementInfo.visibleDialog"
                    v-html="announcementInfo.systemNoticeDetails.content"
                ></div>
                <div class="info-attach">
                    <div
                        v-for="(attach, index) in announcementInfo.systemNoticeDetails
                            .commonAttachmentList"
                        :key="index"
                    >
                        <div
                            class="attach-item"
                            v-if="attach.fileName"
                            @click="handleDownloadfile(attach.fileLacation, attach.fileName)"
                        >
                            <i class="el-icon-document"></i>
                            <span class="attach-name">{{ attach.fileName }}</span>
                        </div>
                    </div>
                </div>
            </div>
        </edu-dialog>
        <!-- 弹屏消息展示 -->
        <Bombscreen />
        <footbar />
        <!-- 信息激活 -->
        <activation />
    </div>
</template>
<script>
import {
    PersonalInfoCard,
    ShortcutMenuCard,
    CommonCard,
    Calendar,
    SystemNotice,
    MyClassSchedule,
    PersonCulturePlan,
    ToDoList,
    Footbar,
    Bombscreen,
} from 'common/src/views/tools/'
import { downloadfile } from 'common/src/api/upload'
import { getPublicMsgDetail } from 'common/src/api/public/information'
import { selectApproFlowList, selectTaskList, getApprovedTaskList } from 'common/src/api/approval'
import {
    findMyCommonMsgPublish,
    findReportList,
    findHigherHallList,
    getSRToken,
} from 'common/src/api/public/information'
import {  findHomePageCommonPublicMsg } from 'common/src/api/public/information'
import filters from 'common/src/filters'
import SchoolCalendarApi from 'common/src/api/calendars'
import Bus from 'common/src/utils/bus'
import * as INDEX from 'common/src/utils/index'
import activation from 'common/src/views/administrator/studentInfoActivation/activation'
import CollapseDown from 'common/src/components/common/CollapseDown'
import queryApplyMinorListVue from './minor/queryApplyMinorList.vue'
import mixin from 'common/src/mixins/index';
export default {
    name: 'Workbench',
    mixins: [mixin],
    filters: {
        formatDate(date) {
            return filters.formatDate(date, 'yyyy/MM/dd hh:mm:ss')
        },
    },
    components: {
        PersonalInfoCard,
        ShortcutMenuCard,
        CommonCard,
        Calendar,
        SystemNotice,
        MyClassSchedule,
        PersonCulturePlan,
        ToDoList,
        Footbar,
        activation,
        CollapseDown,
        Bombscreen,
    },
    data() {
        return {
            noticeContent: {
                moreLink: '#',
                list: [],
            },
            downloadContent: {
                moreLink: '#',
                list: [],
            },
            calendarInfo: null,
            spanStyle: {
                systemNotification: 12,
                myClassSchedule: 18,
                shortcutMenuCard: 12,
            }, // span 样式
            searchParam: {
                pageNum_: 1,
                pageSize_: 20,
            },
            systemNoticeList: [], // 系统公告消息列表
            popMessageList: [], // 系统公告弹窗消息列表
            reportList: [], //学术成果论文报告会通知列表
            higherHallList: [], //高等讲堂列表
            noticMsgList: [], // 通知框消息
            animate: false, // 通知动画是否开启
            animateTimer: null, // 动画定时器
            rowHeight: null, // el-row的高度
            isAdaptive: false, // 是否高度自适应
            loginUserType: null, // 1:管理员，2：教师

            announcementInfo: {
                noTabList: [
                    {
                        label: '本科生',
                        name: '1',
                    },
                    {
                        label: '研究生',
                        name: '2',
                    },
                ],
                activedDepartment: '1', //当前激活管理部门
                visibleDialog: false, //公告弹框
                systemNoticeDetails: {
                    title: '',
                    startTime: '',
                    content: '',
                    publishTime:'',
                    commonAttachmentList: [],
                }, //公告详情
                noticMap: {
                    list: [], //所有公告
                    noticTopList: [], //置顶公告
                    noticList: [], //非置顶公告
                },
            },
            applicationInfo: {
                appTabList: [
                    {
                        label: '申请信息',
                        name: '1',
                    },
                    {
                        label: '历史记录',
                        name: '2',
                    },
                ],
                activedTab: '1', //当前激活页签
                appList: [], //申请列表
                appHisList: [], //申请历史
            },
            agencyInfo: {
                agencyTabList: [
                    {
                        label: '待审批的',
                        name: '1',
                    },
                    {
                        label: '历史记录',
                        name: '2',
                    },
                ],
                activedTab: '1',
                agencyList: [], //待办数据
                agencyHisList: [], //历史待办数据
            },
            query: {
                total: 0,
                pageNum_: 1,
                // pageSize_: 30
                pageSize_: 2147483647,
            },
        }
    },
    computed: {
        currentUser: {
            get() {
                return this.global.currentUser
            },
        },
        mockUser() {
            // state.session.mockUser存在用state.session.mockUser，不存在从localstorage中取
            if (this.$store.state.session.mockUser) {
                return this.$store.state.session.mockUser
            }
            let sessiondata = JSON.parse(localStorage.getItem('sessiondata'))
            if (sessiondata && sessiondata.mockUser) {
                return sessiondata.mockUser
            } else {
                return null
            }
        },
    },
    methods: {
        goSub(path){
            history.pushState(null, 'sub-vue', '/sub-vue')
        },
        //查询公告列表
        async queryNoticsList(val) {
            let params = {
                total: 0,
                pageNum_: 1,
                pageSize_: Infinity,
            }
            let noticMap = this.announcementInfo.noticMap
            if (noticMap && noticMap.list.length == 0) {
                let { code, data } = await findMyCommonMsgPublish(params)
                if (code !== 200) return
                this.announcementInfo.noticMap.list = data.list.map((item) => {
                    item.publishTime = this.formatTime(item.publishTime)
                    return item
                })
            }
            let list = _.cloneDeep(this.announcementInfo.noticMap.list)
            if (val == 1) {
                noticMap.noticTopList = list.filter(
                    (item) =>
                        item.topStatus == 1 &&
                        item.porjIds.findIndex((it) => it == 0 || it == 1) > -1
                )
                noticMap.noticList = list.filter(
                    (item) =>
                        item.topStatus == 0 &&
                        item.porjIds.findIndex((it) => it == 0 || it == 1) > -1
                )
            } else {
                noticMap.noticTopList = list.filter(
                    (item) =>
                        item.topStatus == 1 &&
                        item.porjIds.findIndex((it) => it == 0 || it == 2 || it == 4) > -1
                )
                noticMap.noticList = list.filter(
                    (item) =>
                        item.topStatus == 0 &&
                        item.porjIds.findIndex((it) => it == 0 || it == 2 || it == 4) > -1
                )
            }
        },
        //查询学术成果论文报告会通知列表
        async queryReportList(params) {
            let {
                code,
                data: { list },
            } = await findReportList(params)
            if (code !== 200) return
            list.forEach((el) => {
                let index = el.symposiumDate.lastIndexOf(':')
                el.symposiumDate = el.symposiumDate.substring(0, index)
            })
            this.reportList = list
        },
        //查询高等讲堂列表
        async queryHigherHallList(params) {
            try {
                let {
                    status,
                    result: { result: list },
                } = await findHigherHallList(params)
                if (status !== 200) return

                list.forEach((el) => {
                    el.timeRange =
                        INDEX.parseTime(el.lecture_time_start, '{y}-{m}-{d} {h}:{i}') +
                        '-' +
                        INDEX.parseTime(el.lecture_time_end, '{h}:{i}')
                })
                this.higherHallList = list
            } catch (err) {
                console.log(err)
            }
        },
        handleCurrentChange(val, type) {
            let _this = this,
                actions = {
                    H: function () {
                        _this.$router.push({
                            name: 'maintain',
                            params: {
                                url: `/shurui/applicationview/content/view?appid=fb322bde-052d-4dee-883f-803b618e8ab4&type=view&menuId=b3ad6305-cf4c-4213-abd7-c11494bcf720%231&data_id=${val.data_id}`,
                            },
                        })
                    },
                    R: function () {
                        let path = _this.global.isStudent ? 'achievementApply' : 'paperAudit'
                        _this.$router.push({
                            name: path,
                            params: {
                                data: Object.assign(val, { id: val.applyId }),
                            },
                        })
                    },
                }
            return actions[type]()
        },
        belongToWeek(time) {
            if (!time) return false
            let timestmap = new Date().getTime()
            let weekTimestamp = 7 * 24 * 60 * 60 * 1000
            return timestmap - time < weekTimestamp
        },
        //查询申请列表
        async queryApplicationList(mode) {
            let { code, data } = await selectApproFlowList(this.query)
            if (code !== 200) return
            let list
            if (mode == 1) {
                list = data.list.filter(
                    (item) => !(item.result == 'End' && !this.belongToWeek(item.time))
                )
                this.applicationInfo.appList = list
            } else {
                list = data.list.filter((item) => item.result == 'End')
                if (list.length > 10) list.length = 10
                this.applicationInfo.appHisList = list
            }
        },
        async queryAgencyList(val) {
            if (val == 1) {
                let { code, data } = await selectTaskList(this.query)
                if (code !== 200) return
                this.agencyInfo.agencyList = data.list
            } else {
                let list,
                    { code, data } = await getApprovedTaskList(this.query)
                if (code !== 200) return
                list = data.list.filter((item) => item.result == 'End')
                if (list.length > 10) list.length = 10
                this.agencyInfo.agencyHisList = list
            }
        },
        formatTime(time) {
            return time.slice(0, 10).replace(/-/g, '/')
        },
        async noticeDetails(id) {
            let { code, data } = await getPublicMsgDetail(id)
            if (code !== 200) return
            let details = this.announcementInfo.systemNoticeDetails
            for (let key in details) {
                if (key == 'publishTime') {
                    details[key] = this.formatTime(data[key])
                } else {
                    details[key] = data[key]
                }
            }
            this.announcementInfo.visibleDialog = true
        },
        confirmMsg() {
            this.announcementInfo.visibleDialog = false
        },
        // 处理下载文件
        handleDownloadfile(objectkey, filename) {
            if (!objectkey) return
            downloadfile(filename ? objectkey + `&realName=${filename}` : objectkey)
        },
        // 判断角色权限处理界面展示方法
        judgmentAuthority() {
            this._initHeight()
            // 判断角色权： 1、管理员，2、教师
            if (this.mockUser) {
                if (this.mockUser.type === 2) {
                    this.loginUserType = ''
                    this.spanStyle = {
                        systemNotification: 12,
                        myClassSchedule: 18,
                        shortcutMenuCard: 6,
                    }
                } else {
                    if (this.currentUser.currentRole === '1') {
                        this.loginUserType = '1'
                        this.spanStyle = {
                            systemNotification: 12,
                            myClassSchedule: 18,
                            shortcutMenuCard: 12,
                        }
                        this.$nextTick(() => {
                            this.heightAdaptive()
                        })
                    } else if (this.currentUser.currentRole === '2') {
                        this.loginUserType = '2'
                        this.spanStyle = {
                            systemNotification: 18,
                            myClassSchedule: 18,
                            shortcutMenuCard: 12,
                        }
                    }
                }
            } else {
                if (this.currentUser.currentRole === '1') {
                    this.loginUserType = '1'
                    this.spanStyle = {
                        systemNotification: 12,
                        myClassSchedule: 18,
                        shortcutMenuCard: 12,
                    }
                    this.$nextTick(() => {
                        this.heightAdaptive()
                    })
                } else if (this.currentUser.currentRole === '2') {
                    this.loginUserType = '2'
                    this.spanStyle = {
                        systemNotification: 18,
                        myClassSchedule: 18,
                        shortcutMenuCard: 12,
                    }
                } else {
                    this.loginUserType = ''
                    this.spanStyle = {
                        systemNotification: 12,
                        myClassSchedule: 18,
                        shortcutMenuCard: 6,
                    }
                }
            }
        },
        // 处理弹屏消息
        popUpMessage() {
            this.popMessageList = this.systemNoticeList.filter((item) => item.isPop === true)
            // 负责通知消息处理滚动效果
            this.noticMsgList = _.cloneDeep(this.popMessageList)
            if (this.noticMsgList.length) {
                if (this.animateTimer) {
                    clearInterval(this.animateTimer)
                }
                this.animateTimer = setInterval(this.showMarquee, 2000)
            }
        },
        // 查询系统公告消息列表
        searchSystemNoticeList() {
            this.systemNoticeList = []
            findHomePageCommonPublicMsg(this.searchParam).then((res) => {
                if (res.code == 200) {
                    // 处理置顶
                    // 置顶数组：topArr，非置顶数组： noTopArr
                    let topArr = [],
                        noTopArr = []
                    topArr = res.data.list.filter((item) => item.topStatus === '1')
                    noTopArr = res.data.list.filter((item) => item.topStatus !== '1')
                    // 合并数组并处理时间
                    this.systemNoticeList = topArr.concat(noTopArr).map((item) => {
                        item.startTime = item.startTime.slice(0, 10).replace(/-/g, '/')
                        return item
                    })
                }
            })
        },
        // 通知定时滚动动画效果
        showMarquee: function () {
            this.animate = true
            setTimeout(() => {
                this.noticMsgList.push(this.noticMsgList[0])
                this.noticMsgList.shift()
                this.animate = false
            }, 500)
        },
        // 鼠标划入滚动事件时 模拟hover事件 over和out
        over() {
            if (this.animateTimer) {
                clearInterval(this.animateTimer)
            }
        },
        out() {
            this.animateTimer = setInterval(this.showMarquee, 2000)
        },
        // 通知详情展示
        handleMsgDetails(id) {
            this.$refs.SystemNotice.noticeDetails(id)
        },
        // 首页工作台高度自适应方法
        heightAdaptive() {
            // 获取root-box的高度
            if (!this.$refs.rootBox) return
            let rootBoxHeight = this.$refs.rootBox.clientHeight
            let childenNodeArr = this.$refs.rootBox.querySelectorAll('.el-row')
            let clientHeight = 0
            let firstRowHeight = this.$refs.rootBox.firstChild.clientHeight
            for (let item of childenNodeArr) {
                clientHeight += item.clientHeight
            }
            if (rootBoxHeight > clientHeight) {
                this.rowHeight = rootBoxHeight - firstRowHeight + 'px'
                this.isAdaptive = true
            }
        },
        // 初始化首页row高度
        _initHeight() {
            this.isAdaptive = false
            this.rowHeight = 'auto'
        },
    },
    watch: {
        // 角色改变时调取
        loginUserType() {
            // 获取系统公告列表
            this.searchSystemNoticeList()
            // 获取系统公告弹窗消息
            this.popUpMessage()
        },
        'announcementInfo.activedDepartment': {
            handler(val) {
                 this.queryNoticsList(val) //获取公告信息列表
            },
            deep: true,
            immediate: true,
        },
        // 'applicationInfo.activedTab': {
        //     handler(val) {
        //         this.queryApplicationList(val) //查询申请记录
        //     },
        //     deep: true,
        //     immediate: true,
        // },
        // 'agencyInfo.activedTab': {
        //     handler(val) {
        //         this.queryAgencyList(val) //查询待办列表
        //     },
        //     deep: true,
        //     immediate: true,
        // },
    },
    created() {
        this.announcementInfo.activedDepartment = this.global.projectId == '1' ? '1' : '2'
        // 获取校历信息
        SchoolCalendarApi.currentTermCalendar().then((res) => {
            this.calendarInfo = res.data
        })
        // 判断角色权限
        this.judgmentAuthority()
        // 判断系统公告在该角色下是否配置了该菜单
        Bus.$on('updateCurrentRole', () => {
            this.judgmentAuthority()
        })
        // 判断系统公告菜单是否配置
        Bus.$on('isShowNotice', (item) => {
            if (item) {
                // 获取系统公告列表
                // this.searchSystemNoticeList();
                // 获取系统公告弹窗消息
                this.popUpMessage()
            } else {
                this.systemNoticeList = []
                // 获取系统公告弹窗消息
                this.popUpMessage()
            }
        })
        if (!this.global.isUndergraduate) {
            // this.queryNoticsList(this.global.projectId)
            this.queryReportList({
                pageNum_: 1,
                pageSize_: 2000,
                condition: {
                    yearTerm: '',
                },
            })
            getSRToken(this.global.currentUser.uid).then((res) => {
                if (res.code === 200) {
                    if (
                        ['1.tongji.edu.cn', '122.112.219.67:30669','122.112.162.231:30120'].indexOf(window.location.host) >
                        -1
                    ) {
                        this.queryHigherHallList({
                            pageNum: 1,
                            pageSize: 2000,
                            condition: {},
                        })
                    }
                }
            })
        }
    },
    mounted() {
        this.$nextTick(() => {
            this.heightAdaptive()
        })
        // 根据窗口改变修改高度
        window.addEventListener('resize', () => {
            this._initHeight()
            this.$nextTick(() => {
                this.heightAdaptive()
            })
        })
        // window.onresize = () => {
        // this._initHeight();
        // this.heightAdaptive();
        // };
    },
    beforeDestroy() {
        // 清除监控屏幕改变事件
        window.removeEventListener('resize', () => {})
        // Bus.$off("updateCurrentRole");
        Bus.$off('isShowNotice')
    },
}
</script>
<style lang="scss" scoped>
.root-box {
    width: 100%;
    height: calc(100% - 40px);
    overflow-x: hidden;
    overflow-y: auto;
    padding: 0 20px;
    .edu-notice {
        margin: 4px 0 12px;
        font-size: 14px;
        height: 32px;
        line-height: 32px;
        background: #ffffff;
        box-shadow: 0 6px 10px 0 rgba(0, 13, 82, 0.04);
        border-radius: 2px;
        color: #3a7fe8;
        display: flex;
        .icon-wrapper {
            display: inline-block;
            img {
                width: 16px;
                height: 16px;
                vertical-align: middle;
                margin: 0 8px;
            }
        }
        ul,
        li {
            margin: 0;
            padding: 0;
            list-style: none;
        }
        .marquee_box {
            display: inline-block;
            vertical-align: middle;
            position: relative;
            flex: 1;
            overflow: hidden;
            cursor: pointer;
            .marquee_list {
                display: block;
                position: absolute;
                top: 0;
                left: 0;
                height: 32px;
                line-height: 32px;
            }
            .marquee_top {
                transition: all 0.5s;
                margin-top: -32px;
            }
        }
        span {
            vertical-align: middle;
        }
    }
    .p-b16px {
        padding-bottom: 16px;
    }
    .edu-model {
        padding: 24px;
        height: 320px;
        overflow: hidden;
        // margin-bottom:16px;
        background: #ffffff;
        box-shadow: 0 6px 10px 0 rgba(0, 13, 82, 0.04);
        border-radius: 2px;
    }
    .edu-height50 {
        height: 50%;
    }
    .edu-height100 {
        height: 100%;
    }
}

.card-title {
    font-size: 16px;
}

.content {
    box-sizing: border-box;
    min-height: 210px;
    max-height: 250px;
    overflow: auto;
}

.content li {
    line-height: 32px;
    list-style-type: none;
}
.edu-container {
    background-color: #edf1f5;
    padding-bottom: 30px;
    ::v-deep {
        .el-backtop {
            background-color: #3a7fe8 !important;
        }
    }
    .container-header {
        margin: 16px 124px;
        height: 152px;
        padding: 0 32px;
        background-color: #ffffff;
        border-radius: 4px;
        display: flex;
    }
    .container-content {
        margin: 24px 124px 0 124px;
        border-radius: 4px;
        .label {
            font-size: 24px;
            line-height: 29px;
            color: #8896a7;
        }
        .btn {
            font-size: 14px;
        }
        ul,
        li {
            list-style: none;
            margin: 0;
            padding: 0;
        }
        .announcement-info {
            height: 24px;
            line-height: 24px;
            font-size: 14px;
            font-weight: bold;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: space-between;
            &.li-announcement-info {
                height: calc(100% / 7);
                line-height: 100%;
            }
            &:hover {
                color: #3a7fe8;
                cursor: pointer;
                .order-wrapper {
                    color: #ffffff;
                    background: #3a7fe8;
                }
                .date {
                    color: #3a7fe8;
                }
            }
            &:first-child,
            &:nth-child(2),
            &:nth-child(3) {
                .order-wrapper {
                    color: #ffffff;
                    background: #3a7fe8;
                }
            }
            .order-wrapper {
                display: inline-block;
                width: 16px;
                height: 16px;
                line-height: 16px;
                font-size: 12px;
                text-align: center;
                border-radius: 50%;
                color: #2a3b4f;
                background: #e5e9ef;
                margin-right: 8px;
            }
            .topping {
                width: 20px;
                height: 20px;
                vertical-align: sub;
            }
            // @media (min-width: 1920px) {
            //   height: 36px;
            //   line-height: 36px;
            //   .topping {
            //       height: 36px;
            //       line-height: 36px;
            //       img {
            //         margin: 10px 0;
            //       }
            //     }
            // }
            .info-content {
                width: 65%;
                overflow: hidden;
                white-space: nowrap;
                text-overflow: ellipsis;
            }
            .date {
                // float: right;
                font-size: 14px;
                font-weight: normal;
                color: #8896a7;
            }
        }
        .spacer {
            border-top: 1px dashed #d2d4d6;
            margin-top: 16px;
        }
    }
    .flex-between {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
    }
    .sub_content {
        ::v-deep {
            .el-tabs__header {
                margin: 0;
            }
        }
    }
    //非本科生页面样式
    .graduate_view {
        .el-card {
            margin: 16px;
            border-radius: 8px;
        }
        //通知公告列表
        .scroll_block {
            height: 206px;
            overflow: hidden;
            overflow-y: scroll;
            ul,
            li {
                list-style: none;
                margin: 0;
                padding: 0;
                padding-right: 8px;
            }

            .spacer {
                border-top: 1px dashed #d2d4d6;
                margin: 16px 0;
            }
            .announcement-info {
                height: 24px;
                line-height: 24px;
                font-size: 14px;
                font-weight: bold;
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: space-between;
                &.li-announcement-info {
                    height: calc(100% / 7);
                    line-height: 100%;
                }
                &:hover {
                    color: #3a7fe8;
                    cursor: pointer;
                    .order-wrapper {
                        color: #ffffff;
                        background: #3a7fe8;
                    }
                    .date {
                        color: #3a7fe8;
                    }
                }
                &:first-child,
                &:nth-child(2),
                &:nth-child(3) {
                    .order-wrapper {
                        color: #ffffff;
                        background: #3a7fe8;
                    }
                }
                .order-wrapper {
                    display: inline-block;
                    width: 16px;
                    height: 16px;
                    line-height: 16px;
                    font-size: 12px;
                    text-align: center;
                    border-radius: 50%;
                    color: #2a3b4f;
                    background: #e5e9ef;
                    margin-right: 8px;
                }
                .topping {
                    width: 20px;
                    height: 20px;
                    vertical-align: sub;
                }
                // @media (min-width: 1920px) {
                //   height: 36px;
                //   line-height: 36px;
                //   .topping {
                //       height: 36px;
                //       line-height: 36px;
                //       img {
                //         margin: 10px 0;
                //       }
                //     }
                // }
                .info-content {
                    width: 65%;
                    overflow: hidden;
                    white-space: nowrap;
                    text-overflow: ellipsis;
                }
                .date {
                    // float: right;
                    font-size: 14px;
                    font-weight: normal;
                    color: #8896a7;
                }
            }
        }
        //左上角角标
        .angle {
            position: absolute;
            left: 0;
            top: 0;
            padding: 0 24px;
            height: 32px;
            line-height: 32px;
            text-align: center;
            border-top-left-radius: 8px;
            border-bottom-right-radius: 8px;
            background-color: #3a7fe8;
            color: #ffffff;
        }
        //高等讲堂、论文报告列表
        .table{
            height:calc(100vh - 564px);
            overflow-y: auto;
            min-height: 200px;
        }
    }
}
</style>
